@include('Admin.public.head')
<body>
@include('Admin.public.menu')
<link rel="stylesheet" href="{{ URL::asset('js/admin/layui/css/layui.css') }}"/>
<div class=" admin-content" id="app">
    {{ csrf_field() }}
    <div class="daohang">

    </div>
  {{--添加分类--}}
  
   
  <div class="am-popup am-popup-inner" id="my-popup" style="max-height: 550px;">
      <div class="am-popup-hd">
          <h4 class="am-popup-title">拼团抢购商品</h4>
          <span data-am-modal-close
                class="am-close">&times;</span> </div>
      <div class="am-popup-bd">
          <form class="am-form tjlanmu">
              <div class="am-form-group am-cf">
                  <div class="zuo">拼团商品：</div>
                  <select name="" class="you" v-model="gid">
                      <option value="">请选择商品</option>
                      <option v-for="val in goodsList" :value="val.id">@{{val.goodsname}}</option>
                  </select>
              </div>
  			
  			<div class="am-form-group am-cf">
  			    <div class="zuo">实参团人数：</div>
  			    <div class="you" style="height: 45px;">
  			        <input v-model="buy_num" type="number">
  			    </div>
  			</div>
  			<div class="am-form-group am-cf">
  			    <div class="zuo">虚参团人数：</div>
  			    <div class="you" style="height: 45px;">
  			        <input v-model="actual_num" min="1" max="7" oninput="if (value < 0) value = 1;if(value>7)value=7" type="number" placeholder="虚参团人数 1~7 人">
  			    </div>
  			</div>
			
			<div class="am-form-group am-cf">
			    <div class="zuo">可开团次数：</div>
			    <div class="you" style="height: 45px;">
			        <input v-model="number" type="number">
			    </div>
			</div>
  			
  			<div class="am-form-group am-cf">
  			    <div class="zuo">状态：</div>
  			    <div class="you" style="height: 45px;">
  			       <label><input name="status" v-model="status" type="radio" :value="1" checked/>上架 </label>
  			       <label><input name="status" v-model="status" type="radio" :value="0" />下架 </label> 
  			    </div>
  			</div>
  			
  			<div class="am-form-group am-cf">
  			    <div class="zuo">开始时间：</div>
  			    <div class="you" style="height: 45px;">
  			        <input v-model="start_time" autocomplete="off" type="text" id="St1">
  			    </div>
  			</div>
  			<div class="am-form-group am-cf">
  			    <div class="zuo">结束时间：</div>
  			    <div class="you" style="height: 45px;">
  			        <input v-model="end_time" autocomplete="off" type="text" id="En1">
  			    </div>
  			</div>
  			
              <div class="am-form-group am-cf">
                  <div class="you">
                      <p>
                          <button type="button" v-on:click="save()" class="am-btn am-btn-success am-radius">提交</button>
                      </p>
                  </div>
              </div>
          </form>
      </div>
  </div>
  
  
  
    <div class="am-popup am-popup-inner" id="my-popup1" style="max-height: 600px;">
        <div class="am-popup-hd">
            <h4 class="am-popup-title">编辑拼团抢购商品</h4>
            <span data-am-modal-close
                  class="am-close">&times;</span> </div>
        <div class="am-popup-bd">
            <form class="am-form tjlanmu">
                <div class="am-form-group am-cf">
                    <div class="zuo">拼团商品：</div>
                    <select name="" class="you" v-model="shoping.gid">
                        <option value="">请选择商品</option>
                        <option v-for="val in goodsList" :value="val.id">@{{ val.goodsname }}</option>
                    </select>
                </div>
				
				<div class="am-form-group am-cf">
				    <div class="zuo">虚参与人数：</div>
				    <div class="you" style="height: 45px;">
				        <input v-model="shoping.buy_num" type="number">
				    </div>
				</div>
				
				<div class="am-form-group am-cf">
				    <div class="zuo">实际需参与人数：</div>
				    <div class="you" style="height: 45px;">
				        <input v-model="shoping.actual_num" min="1" max="7" oninput="if (value <= 0) value = 1;if(value>7)value=7" type="number">
				    </div>
				</div>
				
				<div class="am-form-group am-cf">
				    <div class="zuo">可开团次数：</div>
				    <div class="you" style="height: 45px;">
				        <input v-model="shoping.number" type="number">
				    </div>
				</div>
				
				<div class="am-form-group am-cf">
				    <div class="zuo">状态：</div>
				    <div class="you" style="height: 45px;">
				       <label><input name="status" v-model="shoping.status" type="radio" :value="1" checked/>上架 </label>
				       <label><input name="status" v-model="shoping.status" type="radio" :value="0" />下架 </label> 
				    </div>
				</div>
				
				<!-- <div class="am-form-group am-cf">
				    <div class="zuo">活动倒计时：</div>
				    <div class="you" style="height: 45px;">
				       <h3 id="show" style="margin-top: 6px;"><span></span>天<span></span>小时<span></span>分<span></span>秒</h3>
					   <h3 id="show1" style="color: red;margin-top: -19px;">活动时间已结束</h3>
				    </div>
				</div> -->
				<!-- <div>
					<h3 id="show">倒计时：<span></span>天<span></span>小时<span></span>分<span></span>秒</h3>
				</div> -->
				
				<div class="am-form-group am-cf">
				    <div class="zuo">开始时间：</div>
				    <div class="you" style="height: 45px;">
				        <input v-model="shoping.start_time" type="text" id="St">
				    </div>
				</div>
				<div class="am-form-group am-cf">
				    <div class="zuo">结束时间：</div>
				    <div class="you" style="height: 45px;">
				        <input v-model="shoping.end_time" type="text" id="En">
				    </div>
				</div>
				
                <div class="am-form-group am-cf">
                    <div class="you">
                        <p>
                            <button type="button" v-on:click="save1()" class="am-btn am-btn-success am-radius">提交</button>
                        </p>
                    </div>
                </div>
            </form>
        </div>
    </div>
	
	
  <div class="am-popup am-popup-inner" id="my-popup2" style="max-height: 550px;overflow-y: scroll;" id="look">
      <div class="am-popup-hd">
          <h4 class="am-popup-title">拼团信息</h4>
          <span data-am-modal-close
                class="am-close">&times;</span> </div>
      <div class="am-popup-bd">
				<div style="height: auto;background-color: #FFFFFF;" v-for="val,index in userinfo">
					<div style="width: 100%;height: 40px;border-bottom: #BBBFC3 1px solid;padding-top: 10px; ">
						<p style="float: left;">
							用户：<span class="red">@{{val.nickname}}</span>&nbsp;&nbsp;所发起的拼团.&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
							<span style="color: red;" v-show="val.open_state == 1">已开</span>
							<span style="color: red;" v-show="val.open_state == 0">未开</span>
							<span style="color: red;" v-show="val.open_state == -1">已解散</span>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
						</p>
						<button style="padding: 4px;float: right;margin-right: 10px;border: none;border-radius: 12px;background-color: #FF7F24;color: white;" data-am-modal="{target: '#my-popup3'}" v-on:click="see(val.id)">查看参团用户</button>
						<!-- <button style="padding: 4px;float: right;margin-right: 10px;border: none;border-radius: 12px;background-color: #FF7F24;color: white;" v-on:click="add2(val.id)">参与拼团</button> -->
					</div>
				</div>
      </div>
  </div>
  
  <div class="am-popup am-popup-inner" id="my-popup3" style="max-height: 550px;">
      <div class="am-popup-hd">
          <h4 class="am-popup-title">参团用户列表</h4>
          <span data-am-modal-close
                class="am-close">&times;</span> </div>
      <div class="am-popup-bd">
  				<div style="height: auto;background-color: #FFFFFF;" v-for="val in userinfo1">
  					<div style="width: 100%;height: 40px;border-bottom: #BBBFC3 1px solid;padding-top: 10px; ">
  						<p style="float: left;">
  							用户：<span class="red">@{{val.nickname}}</span>&nbsp;&nbsp;参与成功!
  						</p>
  						<!-- <button style="padding: 4px;float: right;margin-right: 10px;border: none;border-radius: 12px;background-color: #FF7F24;color: white;" data-am-modal="{target: '#my-popup3'}" v-on:click="see(val.id)">查看参团用户</button> -->
  						<!-- <button style="padding: 4px;float: right;margin-right: 10px;border: none;border-radius: 12px;background-color: #FF7F24;color: white;" v-on:click="add2(val.id)">参与拼团</button> -->
  					</div>
  				</div>
				
      </div>
  </div>
  
	
	
	
    <div class="admin-biaogelist">
        <div class="listbiaoti am-cf">
            <ul class="am-icon-flag on">商品栏目管理</ul>
            <dl><button type="button" class="am-btn am-btn-danger am-round am-btn-xs am-icon-plus" v-on:click="selectGoods()" data-am-modal="{target: '#my-popup'}">添加拼团抢购商品</button></dl>
            <!--data-am-modal="{target: '#my-popup'}" 弹出层 ID  弹出层 190行 开始  271行结束-->
        </div>
        <form class="am-form am-g">
            <table width="100%" class="am-table am-table-bordered am-table-radius am-table-striped am-table-hover">
                <thead>
                <tr class="am-success">
					<!-- <th class="table-title">拼团商品ID</th> -->
                    <th class="table-title">拼团商品</th>
					<th class="table-title">商品价格</th>
					<th class="table-title">库存</th>
                    <th class="table-title">虚开团人数</th>
                    <th class="table-type">实开团人数</th>
					<th class="table-type">可开团次数</th>
                    <th class="table-type">活动开始时间</th>
					<th class="table-type">活动结束时间</th>
                    <th >上架/下架<i class="am-icon-check am-text-warning"></i> <i class="am-icon-close am-text-primary"></i></th>
					<th class="table-title">创建时间</th>
					<th class="table-title">修改时间</th>
                    <th width="163px" class="table-set">操作</th>
                </tr>
                </thead>

                <tbody>
                <tr  v-for="(val,index) in categoryList">
                    <!-- <td class="am-hide-sm-only">@{{ val.id}}</td> -->
					<td class="am-hide-sm-only">@{{ val.goodsname}}</td>
                    <td class="am-hide-sm-only">@{{ val.rulingprice}}</td>
					<td class="am-hide-sm-only">&nbsp;&nbsp;&nbsp;&nbsp;@{{ val.total}}&nbsp;&nbsp;&nbsp;</td>
                    <td class="am-hide-sm-only">@{{ val.buy_num}}</td>
					<td class="am-hide-sm-only">@{{ val.actual_num}}</td>
					<td class="am-hide-sm-only">@{{ val.number}}</td>
                    <td class="am-hide-sm-only">@{{ val.start_time }}</td>
					<td class="am-hide-sm-only">@{{ val.end_time }}</td>
                   <td class="am-hide-sm-only">
                       <i v-show="val.status == 1" class="am-icon-check am-text-warning"></i>
                       <i v-show="val.status == 0" class="am-icon-close am-text-primary"></i>
                   </td>
				    <td class="am-hide-sm-only">@{{ val.created_at}}</td>
					<td class="am-hide-sm-only">@{{ val.updated_at}}</td>
                    <td>
                        <div class="am-btn-toolbar">
                            <div class="am-btn-group am-btn-group-xs">
                                <a class="am-btn am-btn-default am-btn-xs am-text-success am-round am-icon-plus"  v-on:click="add(val.id)" data-am-modal="{target: '#my-popup'}" title="添加子栏目"></a>
                                <button type="button" class="am-btn am-btn-default am-btn-xs am-text-secondary am-round" data-am-modal="{target: '#my-popup1'}" v-on:click="edit(val.id)" title="修改"><span class="am-icon-pencil-square-o" ></span></button>
                                <button type="button" class="am-btn am-btn-default am-btn-xs am-text-danger am-round" data-am-modal="{target: '#my-popup2'}" v-on:click="look(val.id,index)" title="查看"><span class="am-icon-search"></span></button>
								<button type="button" class="am-btn am-btn-default am-btn-xs am-text-danger am-round" v-on:click="delet(val.id)" title="删除"><span class="am-icon-trash-o"></span></button>
                            </div>
                        </div>
                    </td>
                </tr>
                {{--<tr v-for="(parts,n) in val.tow_data">--}}
                    {{--<td><input type="checkbox" /></td>--}}
                    {{--<td><input type="text" :value="parts.displayorder" class="am-form-field am-radius am-input-sm"/></td>--}}
                    {{--<td class="am-text-center">14</td>--}}
                    {{--<td>--}}
                        {{--<a href="#"><span v-if="parts.pid != 0" style="margin-left:30px">├─</span>@{{ parts.name }}</a>--}}
                    {{--</td>--}}
                    {{--<td class="am-hide-sm-only">@{{ parts.description }}</td>--}}
                    {{--<td class="am-hide-sm-only"><img style="width: 50px;height: 50px" :src="parts.thumb" alt=""></td>--}}
                    {{--<td class="am-hide-sm-only">@{{ parts.src }}</td>--}}
                    {{--<td class="am-hide-sm-only">--}}
                        {{--<span v-if="parts.enabled == 1"><i class="am-icon-check am-text-warning"></i></span>--}}
                        {{--<span v-if="parts.enabled == 0"><i class="am-icon-close am-text-primary"></i></span>--}}
                    {{--</td>--}}
                    {{--<td>--}}
                        {{--<div class="am-btn-toolbar">--}}
                            {{--<div class="am-btn-group am-btn-group-xs">--}}
                                {{--<a class="am-btn am-btn-default am-btn-xs am-text-success am-round am-icon-plus"  v-on:click="add(parts.id)" data-am-modal="{target: '#my-popup'}" title="添加子栏目"></a>--}}
                                {{--<button type="button" class="am-btn am-btn-default am-btn-xs am-text-secondary am-round" data-am-modal="{target: '#my-popup'}" v-on:click="edit(parts.id)" title="修改"><span class="am-icon-pencil-square-o" ></span></button>--}}
                                {{--<button type="button" class="am-btn am-btn-default am-btn-xs am-text-danger am-round" v-on:click="delet(parts.id)" title="删除"><span class="am-icon-trash-o"></span></button>--}}
                            {{--</div>--}}
                        {{--</div>--}}
                    {{--</td>--}}
                {{--</tr>--}}
                </tbody>
            </table>
            {{--</div>--}}
            <ul class="am-pagination am-fr">
                <div class="block">
                    <el-pagination
                            background
                            :page-size="PagesData.per_page"
                            :current-page = "PagesData.current_page"
                            layout="total , prev, pager, next"
                            :total="PagesData.total"
                            @prev-click="changeClick"
                            @next-click="changeClick"
                            @current-change="changeClick">
                        >
                    </el-pagination>
                </div>
            </ul>
        </form>
    </div>
</div>
</div>
<!-- <script src="{{ URL::asset('js/admin/laydate/laydate.js') }}"></script> -->
<script src="{{ URL::asset('js/admin/amazeui.min.js') }}"></script>
<script src="{{ URL::asset('js/admin/layui/layui.js') }}"></script>


<script>
	// laydate.render({
	//   elem: '#time1' ,
	//   type: 'datetime',
	//   done: function (value, date, endDate) {
	//       // console.log(value)
	//       app.start_time = value
	//   }
	// });
	// laydate.render({
	//   elem: '#time2' ,
	//   type: 'datetime',
	//   done: function (value, date, endDate) {
	//       // console.log(value)
	//       app.end_time = value
	//   }
	// });
	 layui.use(['layer', 'laydate'], function () {
		            //加载模块
		            layer1 = layui.layer;
		            layDate1 = layui.laydate;
		            layDate1.render({
		                elem: '#St1',//绑定元素
		            	type: 'datetime',
		                theme:'#FF7256',//主题,
		            	done: function (value, date, endDate) {
		            	    // console.log(value)
		            	    app.start_time = value
		            	}
		            });
		            layDate1.render({
		                elem: '#St',//绑定元素
						type: 'datetime',
		                theme:'#FF7256',//主题,
						done: function (value, date, endDate) {
						    // console.log(value)
						    app.shoping.start_time = value
						}
		            });
					layDate1.render({
					    elem: '#En1',//绑定元素
						type: 'datetime',
					    theme:'#393D49',//主题,
						done: function (value, date, endDate) {
						    // console.log(value)
						    app.end_time = value
						}
					});
					layDate1.render({
					    elem: '#En',//绑定元素
						type: 'datetime',
					    theme:'#393D49',//主题,
						done: function (value, date, endDate) {
						    // console.log(value)
						    app.shoping.end_time = value
						}
					});
				});
</script>
<script>
    layui.use(['form', 'upload'], function(){
        var form = layui.form, upload = layui.upload;
        //执行实例
        var uploadInst = upload.render({
            elem: '#test1' //绑定元素
            ,url: '/upload?_token='+'{{csrf_token()}}'+'&folder=classify'//上传接口
            ,done: function(res){
                if (res.code) {
                    app.category.thumb = res.data.thumb
                    app.imgName = res.data.image
                } else {
                    layer.msg(res.data);
                }
            }
            ,error: function(err){
                //请求异常回调
                layer.msg('格式错误');
            }
        });
    });
</script>
<script>
    var app = new Vue({
        el: '#app',
        data: {
            category:{ //添加分类列表
                id:'',
                pid:'',
                thumb:'',
                image:'',
                type:'1',
                src:'',
            },
            categoryList :[],
			goodsList:{},
            shoping:{},
            imgName:'',
			gid:'',
			start_time:'',
			end_time:'',
			buy_num:'',
			actual_num:'',
			number:'',
			id:'',
			goodsname:'',
			status:1,
			PagesData:[],
			userinfo:{},
			userinfo1:{},
			index:''
        },
        methods: {
			changeClick:function(e){
				var rico = this
			    $.get("/admin/goods/shoppingList",{'_token':'{{csrf_token()}}',class:'list',page:e},function (res) {
			        if(res.code){
			            app.PagesData = res.data
						app.categoryList = res.data.data
						//console.log(app.PagesData)
			        } else {
			            layer.msg(res.data);
			        }
			    });
			},
            initialize:function(){
                $.post("/admin/goods/shoppingList",{'_token':'{{csrf_token()}}',class:'list'},function (res) {
                    if(res.code){
						app.categoryList = res.data.data
						app.PagesData = res.data
                    } else {
                        layer.msg(res.data);
                    }
                });
            },
			//删除
			delet:function (id) {
			    $.post("/admin/goods/shoppingList",{'_token':'{{csrf_token()}}',class:'delete',id:id},function (res) {
			        if(res.code){
			            layer.msg(res.data);
			            window.location.href="/admin/goods/shoppingIndex";
			        } else {
			            layer.msg(res.data);
			        }
			    });
			},
			selectGoods:function(){
				$.post("/admin/goods/shoppingList",{'_token':'{{csrf_token()}}',class:'goods'},function (res) {
				    if(res.code){
				        app.goodsList = res.data;
				    } else {
				        layer.msg(res.data);
				    }
				});
			},
			
			see:function(id){
				$.post("/admin/goods/shoppingList",{'_token':'{{csrf_token()}}',class:'group_member',id:id},function (res) {
				    if(res.code){
				        app.userinfo1 = res.data;
				    } else {
				        layer.msg(res.data);
				    }
				});
			},
			
			// new:function(){
			// 	window.location.href="/admin/goods/shoppingIndex";
			// },
			
            //编辑
            edit:function (id) {
                // console.log(id);
                $.post("/admin/goods/shoppingList",{'_token':'{{csrf_token()}}',class:'find',id:id},function (res) {
                    if(res.code){
						// app.buy_num = res.data.buy_num;
						// app.actual_num = res.data.actual_num;
						// app.status = res.data.status;
						// app.start_time = res.data.start_time;
						// app.end_time = res.data.end_time;
						app.shoping = res.data;
						//console.log(app.shoping);
						app.goodsList = res.goods;
						// var show=document.getElementById("show").getElementsByTagName("span");
						// function countTime(){
						// 			var now =  Date.parse(new Date());
						// 			var end = Date.parse(app.shoping.end_time);
						// 			var num = end - now;
									
						//             var day=parseInt(num/(24*60*60*1000));			
						//             num=num%(24*60*60*1000);
						//             var hour=parseInt(num/(60*60*1000));            
						//             num=num%(60*60*1000);
						//             var minute=parseInt(num/(60*1000));
						//             num=num%(60*1000);
						//             var seconde=parseInt(num/1000);
						//               show[0].innerHTML=day;
						//               show[1].innerHTML=hour;
						//               show[2].innerHTML=minute;
						//               show[3].innerHTML=seconde;
						// 			  if(day < 0 || hour < 0 || minute < 0 || seconde < 0){
						// 				  document.getElementById("show").style.visibility="hidden";
						// 				  document.getElementById("show1").style.visibility="visible";
						// 			  }else{
						// 				  document.getElementById("show").style.visibility="visible";
						// 				  document.getElementById("show1").style.visibility="hidden";
						// 			  }
						//             }
						// setInterval(countTime,1000);
                    } else {
                        layer.msg(res.data);
                    }
                });
            },
            //添加子分类
            add:function (pid) {
                app.category = {
                    id:'',
                    pid:pid,
                    thumb:'',
                    image:'',
                };
            },
            //查看
            look:function (id,index) {
				app.index = index;
                $.post("/admin/goods/shoppingList",{'_token':'{{csrf_token()}}',class:'group_list',group_id:id},function (res) {
                    if(res.code == 1){
						app.userinfo = res.data;
						console.log(app.userinfo);
                    } else if(res.code == 0) {
                        layer.msg(res.data);
						app.userinfo = null;
                    }
                });
            },
            //添加
            save:function () {
                $.post("/admin/goods/shoppingList",{'_token':'{{csrf_token()}}',class:'add',number:app.number,id:app.id,gid:app.gid,start_time:app.start_time,end_time:app.end_time,buy_num:app.buy_num,actual_num:app.actual_num,status:app.status},function (res) {
                    if(res.code == 1){
                        layer.msg(res.data);
						window.location.href='/admin/goods/shoppingIndex';
                    } else {
                        layer.msg(res.data);
                    }
                });
				if(app.gid == ''){
				    layer.msg('请选择拼团商品');return;
				}
				if(app.start_time == ''){
				    layer.msg('请选择拼团开始时间');return;
				}
				if(app.end_time == ''){
				    layer.msg('请选择拼团结束时间');return;
				}
				if(app.buy_num == ''){
				    layer.msg('填写拼团人数');return;
				}
				if(app.actual_num == ''){
				    layer.msg('请填写实际拼团人数');return;
				}
            },
			save1:function () {
			    $.post("/admin/goods/shoppingList",{'_token':'{{csrf_token()}}',
				class:'add',
				id:app.shoping.id,
				gid:app.shoping.gid,
				number:app.shoping.number,
				start_time:app.shoping.start_time,
				end_time:app.shoping.end_time,
				buy_num:app.shoping.buy_num,
				actual_num:app.shoping.actual_num,
				status:app.shoping.status},
				function (res) {
			        if(res.code == 1){
			            layer.msg(res.data);
						window.location.href='/admin/goods/shoppingIndex';
			        } else {
			            layer.msg(res.data);
			        }
			    });
				if(app.gid == ''){
				    layer.msg('请选择拼团商品');return;
				}
				if(app.start_time == ''){
				    layer.msg('请选择拼团开始时间');return;
				}
				if(app.end_time == ''){
				    layer.msg('请选择拼团结束时间');return;
				}
				if(app.buy_num == ''){
				    layer.msg('填写拼团人数');return;
				}
				if(app.actual_num == ''){
				    layer.msg('请填写实际拼团人数');return;
				}
			},
			
            empty:function () {
                app.category = {
                    id:'',
                    pid:0,
                    thumb:'',
                    image:'',
                    src:'',
                };
            }
        },
        //自动执行
        mounted: function () {
            this.initialize();
        },


    })
	
</script>


<!--<![endif]-->
</body>
</html>